<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
	<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
	<title>NewFile</title>
	<link rel="stylesheet" href="./Tpl/css/bootstrap.min.css">
	<style type="text/css">
		.ZT{
			margin:0px;
			padding: 0px;
			margin: 0 auto;

		}
		.formtop{
			margin: 0 auto;
			width: 800px;
			height: 65px;
			border-radius:50% 50% 0px 0px;
			box-shadow: 10px 10px 15px #888888;
			position: relative;/* 相对定位 */
			background: #E5F9A9 url() 0 0 no-repeat;
		}
		.boxXZ{
			width: 100px;
			height: 40px;
			background: #77C2E8 url() 0 0 no-repeat;
			position: absolute;
			left: 15px;
			top: 14px;
			text-align: center;
			line-height: 40px;
			font-size: 16px;
			border-radius:4px;
			color: #fff;
			cursor: pointer;

		}
		.boxSC{
			width: 80px;
			height: 40px;
			background: #77C2E8 url() 0 0 no-repeat;
			position: absolute;
			right: 590px;
			top: 14px;
			text-align: center;
			line-height: 40px;
			font-size: 16px;
			border-radius:4px;
			color: #fff;
			
		}
		.inputXZ{
			width: 100px;
			height: 40px;
			opacity: 0;
			position: absolute;
			top:0px;
			left: 0px;
			cursor: pointer;
		}
		.inputSC{
			width: 80px;
			height: 40px;
			opacity: 0;
			position: absolute;
			top:0px;
			left: 0px;
		}
		.XM{
			width: 800px;
			height: 450px;
			margin: 0 auto;
			border-radius:0px 0px 25% 5%;
			box-shadow: 10px 10px 15px #888888;
			background: #FAF1C6 url() 0 0 no-repeat;
			padding: 10px;
		}
		.XM table{
			width: 100%;
		}
		.XM tr{
			height: 60px;
			font-size: 17px;
		}
		.XM td{
			text-align: center;
			padding: 0px 0px;
			font-size: 17px;
		}
		.XM a{
			width: 45px;
			height: 30px;
			line-height: 30px;
			display: inline-block;
			background: #337AB7 url() 0 0 no-repeat;
			text-decoration: none;
			border-radius: 4px;
			color: #fff;
			font-size: 14px;
		}
		.tr1{
			color: #888888;
		}
		a:hover{
			color: #000000;
		}
		.XM .td1 .a2{
			background: red url() 0 0 no-repeat;
		}
		#tdimg img{
			width: 40px;
			height: 40px;
		}
		.page{
			width: 400px;
			margin-left: 35%;
			padding: 0px 50px; 
		}
		.pagination{
			margin-left: 25px;
		}
	</style>
</head>
<body>
	<div class="col-md-12 main ZT">
		<form class="formtop" action="./upload.php" method="post" enctype="multipart/form-data">
			<div class="col-md-6 main boxXZ">选择文件
				<input class="inputXZ" type="file" name="file">
			</div>
			<div class="col-md-6 main boxSC">上传
				<input class="inputSC" type="submit" value="上传">
			</div>
		</form>
		<div class="XM">
			<table>
				<tr class="tr1">
					<td>预览</td>
					<td>类型</td>
					<td>上传时间</td>
					<td>大小</td>
					<td>下载</td>
					<td>删除</td>
				</tr>
				<?php foreach ($arr as $k =>$v) { ?>
					<tr>
						<td id="tdimg"><?php echo ImgName($v) ?></td>
						<td><?php echo IMG($v) ?></td>
						<td><?php echo date('Y-m-d H:i:s',filemtime($v)) ?></td>
						<td><?php echo CF(filesize($v)) ?></td>
						<td class="td1"><a href="down.php?id=<?php echo $k ?>">下载</a></td>
						<td class="td1"><a class="a2" href="del.php?id=<?php echo $k ?>">删除</a></td>
					</tr>
				<?php } ?>

			</table>
		</div>
		<div class="navbox page">
			<nav aria-label="Page navigation">
			  <ul class="pagination">
			    
				<?php if ($page<>1) { ?>
				    <li>
				        <a href="./index.php?p=<?php echo $page-1 ?>" aria-label="Previous">
				          	<span aria-hidden="true">&laquo;</span>
				      	</a>
				    </li>
			    <?php } ?>

			    <?php for ($i=1; $i <= $pages ; $i++) { ?>
			    	<li><a href='./index.php?p=<?php echo $i ?>'><?php echo $i ?></a></li>
			    <?php } ?>
			    
			    <?php if ($page<>$pages) { ?>
				    <li>
				      <a href="./index.php?p=<?php echo $page+1 ?>" aria-label="Next">
				        <span aria-hidden="true">&raquo;</span>
				      </a>
				    </li>
			    <?php } ?>

			  </ul>
			</nav>
		</div>
	</div>
</body>
</html>